<template>
	<view style="padding: 0 15px;">
		<u--textarea 
			v-model="feedback.feedText"
			placeholder="请输入您要反馈的问题..." 
			border="none"
			height="120"
			count >
		</u--textarea>
		
		<u-upload
			:fileList="fileList1"
			@afterRead="afterRead"
			@delete="deletePic"
			name="1"
			multiple
			:maxCount="10"
		></u-upload>
		
		<view class="ade_detial">
			<view>
				<view>
					导航名称：
				</view>
				<view>
					<u-text :lines="1" :text="aedInfo.aedName"></u-text>
				</view>
			</view>
			
			<view>
				<view>
					状态：
				</view>
				<view>
					<u-text :lines="1" :text="aedInfo.status == 0 ? '正常' : '未开放'">
					</u-text>
				</view>
			</view>
			
			<view>
				<view>
					联系电话：
				</view>
				<view>
					<u-text :lines="1" :text="aedInfo.phoneNum">
					</u-text>
				</view>
			</view>
			
			<view>
				<view>
					导航地址：
				</view>
				<view>
					<u-text :lines="1" :text="aedInfo.address">
					</u-text>
				</view>
			</view>
		</view>
		
		<view style="margin: 20px auto; width: 70%;">
			<u-button 
			:disabled="!feedback.feedText"
			@click="submitFeed"
			type="error" 
			text="确定"
			shape="circle"
			></u-button>
		</view>
		<u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
	import { feedAdd } from "../../config/api.js"
	export default {
		data() {
			return {
				aedInfo: {},
				feedback:{
					feedText: "",
					feedImg: null,
					aedId: null,
					userId: null
				},
				fileList1: [],
			}
		},
		onLoad(option) {
			this.aedInfo = JSON.parse(option.info);
			this.feedback.aedId = this.aedInfo.id;
			
			const that = this;
			const info = uni.getStorageSync("userInfo");
			if(info){
				that.feedback.userId = info.id;
			}
			
		},
		methods: {
			submitFeed(){
				const that = this;
				if(that.fileList1.length != 0){
					const imgListStr = that.fileList1.map(item => item.url).join(",");
					that.feedback.feedImg = imgListStr;
				}
				
				feedAdd(that.feedback).then(res => {
					this.$refs.uToast.show({
						type: "success",
						message: "已提交！",
						complete() {
							  uni.switchTab({
								url: "/pages/index/index"
							  });
						  },
					})
				})
				
				
			},
			// 删除图片
		  deletePic(event) {
			this[`fileList${event.name}`].splice(event.index, 1);
		  },
		  // 新增图片
		  async afterRead(event) {
			// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
			let lists = [].concat(event.file);
			let fileListLen = this[`fileList${event.name}`].length;
			lists.map((item) => {
			  this[`fileList${event.name}`].push({
				...item,
				status: "uploading",
				message: "上传中",
			  });
			});
			for (let i = 0; i < lists.length; i++) {
			  const result = await this.uploadFilePromise(lists[i].url);
			  let item = this[`fileList${event.name}`][fileListLen];
			  this[`fileList${event.name}`].splice(
				fileListLen,
				1,
				Object.assign(item, {
				  status: "success",
				  message: "",
				  url: result,
				})
			  );
			  fileListLen++;
			}
		  },
		  uploadFilePromise(url) {
			return new Promise((resolve, reject) => {
			  let a = uni.uploadFile({
				url: "http://127.0.0.1:8080/api/uploadAvater", // 仅为示例，非真实的接口地址
				filePath: url,
				name: "file",
				success: (uploadFileRes) => {
					let res = JSON.parse(uploadFileRes.data);
					resolve(res.data);
				},
			  });
			});
		  },
		}
	}
</script>

<style scoped>
	
	.ade_detial{
		margin-top: 15px;
	}
	.ade_detial>view{
		display: flex;
		border-bottom: 1px solid #bfbfbf;
		padding: 10px 0;
	}
	
	.ade_detial>view>view:nth-child(1){
		width: 95px;
	}
	
	.ade_detial>view>view:nth-child(2){
		flex: 1;
		text-align: right;
	}
	

</style>
